layui.use(['layer'], function (layer) {

    let app = new Vue({
        el: "#recordApp",
        data: {
            isHit: false,
            record: {}
        },
        methods: {
            up(data) {
                let that = this;
                that.isHit = true;
                style($(".up"), $(".icon"), $(".upCard"), data);
            },
            down(data) {
                style($("#down"), $("#iconDown"), $("#downCard"), data);
            }
        },
        mounted() {
            const that = this;
            $.ajax({
                url: "../record/" + parseInt(Base64.decode(getToken())),
                async: false,
                type: 'get',
                success: function (data) {
                    console.log(data);
                    if (data.obj) {
                        that.record = data.obj;
                        if (null != data.obj.begintime) {
                            that.up(data.obj.begintime);
                            if (null != data.obj.endtime) {
                                setTimeout(function () {
                                    that.down(data.obj.endtime)
                                }, 10);
                            }
                        }
                    }
                }
            });
        }
    });


//打卡上班
    $(document).on("click", ".up", function (e) {
        common("up", $(".up"), $(".icon"), $(".upCard"))
    });

//打卡下班
    $(document).on("click", ".down", function (e) {
        common("down", $("#down"), $("#iconDown"), $("#downCard"))
    });


    function common(path, $target, $icon, $card) {
        $.ajax({
            url: "../record/" + path + "/" + parseInt(Base64.decode(getToken())),
            success: function (data) {
                console.log(data);
                if (data.success) {
                    style($target, $icon, $card, data.obj);
                    app.isHit = data.success;
                    layer.msg(
                        data.msg,
                        {
                            icon: 1,
                            time: 1000
                        },
                        function () {
                            window.location.reload();
                        });
                } else {
                    layer.msg(data.msg, {icon: 2});
                }
            }
        })
    }

    function style($target, $icon, $card, data) {
        $target.css({"background-color": "#90F5A7"});
        $icon.removeClass("layui-icon layui-icon-camera");
        $icon.addClass("layui-icon layui-icon-ok");
        $icon.css({"color": "#216AF2"});
        $card.css({"color": "#216AF2"});
        $card.text(data)
    }

    //获取当前时间
    function getCurrentTimeNum() {
        var date = new Date();
        var hours = date.getHours();
        var minutes = date.getMinutes();
        var seconds = date.getSeconds();

        if (minutes >= 0 && minutes <= 9) {
            minutes = "0" + minutes;
        }
        if (seconds >= 0 && seconds <= 9) {
            seconds = "0" + seconds;
        }
        return "" + hours + minutes + seconds;
    }
});